<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="_fragments :: head(~{::title})">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>关于WIDS</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css">
    <script src="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.js"></script>
    <link rel="stylesheet" href="../static/css/animate.compat.css">
    <link rel="stylesheet" href="../static/css/me.css">
   
</head>
<body>
    <!-- 导航 -->
    <nav th:replace="_fragments :: menu(5)" class="ui secondary attached m-opacity-mid segment m-mini m-shadow animated fadeInDown">
        <div class=" ui container">
            <div class="ui secondary stackable menu">
                <h1 class="ui violet header item">WIDS NEWS</h1>
                    <a href="#" class="m-item item m-mobile-hide"><i class="home icon"></i> 首页</a>
                    <a href="#" class="m-item item m-mobile-hide"><i class="folder icon"></i> 分类</a>
                    <a href="#" class="m-item item m-mobile-hide"><i class="window close outline icon"></i> 归档</a>
                    <a href="#" class="m-item item m-mobile-hide"> <i class="tags icon"></i>标签</a>
                    <a href="#" class="m-item item m-mobile-hide"><i class="question circle outline icon"></i> 关于 WIDS </a>

                    <div class="right item m-mobile-hide">
                        <div class="ui icon transparent input">
                            <input type="text" placeholder="Search...">
                            <i class="search link icon"></i>
                        </div>
                    </div>
            </div>

            <a href="" class="ui menu toggle blue icon button m-right-top m-mobile-show">
                <i class="sidebar icon">

                </i>
            </a>

        </div>


    </nav>
    <!-- 中间内容 -->
    <main class="m-large m-container-small animated fadeInLeft animated fadeIn">
       <div class="ui container">
            <div class="ui grid">
                <div class="eleven wide column">
                    <div class="ui segment">
                    <img src="http://www.wids.edu.cn/upload/20180404/1ca70gpvfssf12t2g.jpg" alt="" class="ui rounded image" >
                    </div>
                </div>
                <div class="five wide column">
                    <div class="ui top attached segment">
                        <div class="ui header">关于WIDS</div>
                    </div>
                    <div class="ui attached segment">
                        <p class="m-text-p">
                            学校成立于2004年，历经湖北美术学院艺术设计学院和华中农业大学楚天学院两个发展阶段，
                            2015年经教育部批准更名为武汉设计工程学院，2016年获批参照独立设置的本科艺术院校进行招生，
                            已发展成一所以艺术为主、多学科协调融合发展的本科院校。
                            学校下设成龙影视传媒学院、环境设计学院、时尚设计学院、公共艺术学院、食品与生物科技学院
                            、商学院、信息工程学院、亚心护理学院等8个学院，现有在校生9700余人。
                        </p>

                    </div>
                    
                    <div class="ui attached segment">
                        <button class="ui circular facebook icon button">
                            <i class="facebook icon"></i>
                          </button>
                          <button class="ui circular twitter icon button">
                            <i class="twitter icon"></i>
                          </button>
                          <button class="ui circular linkedin icon button">
                            <i class="linkedin icon"></i>
                          </button>
                          <button class="ui circular google plus icon button">
                            <i class="google plus icon"></i>
                          </button>
                    </div>
                    

                </div>
            </div>

       </div>
       



    </main>
    
    

    <!-- 底部 -->
    <footer th:replace="_fragments :: footer" class="ui secondary m-opacity-mid vertical segment m-massive m-shadow">
        <div class="ui center aligned container">
            <div class="ui secondary divided stackable grid">
                <div class="three wide column">
                        <img src="../static/images/gdpu.jpg" class="ui rounded image" alt="" style="widows: 150px;">
                </div>
                <div class="three wide column">
                    <h4 class="ui purple header">最新新闻</h4>
                    <div class="ui link list">
                        <a href="" class="item">国家大事</a>
                        <a href="" class="item">校园趣闻</a>
                        <a href="" class="item">日常</a>
                    </div>
                </div>
                <div class="three wide column">
                    <h4 class="ui purple header">联系我们</h4>
                    <div class="ui link list">
                        <a href="" class="item">2422031531@qq.com</a>
                        <a href="" class="item">武汉设计工程学院</a>
                        
                    </div>
                </div>
                <div class="seven wide column">
                    <h4 class="ui purple header">WIDS</h4>
                    <a href="" class="item">这是一个宣传禁毒政策、分享国家新闻的网站</a>
                </div>
            </div>

            <h3 class="ui horizontal black divider">splict </h3>
            <h5 class="ui grey header">Copyright @2020-2021 WIDS Designed By Retroxxx</h5>
        </div>




    </footer>


    <script src="../static/js/jquery-3.4.1.min.js"></script>
    <script>
        $('.menu.toggle').click(function(){
            $('.m-item').toggleClass('m-mobile-hide');

        });
   
    </script>
   

</body>
</html>